/*
 * @Author: wangtao
 * @Date: 2020-06-29 16:32:41
 * @LastEditors: 汪滔
 * @LastEditTime: 2021-04-08 14:35:59
 * @Description: file content
 */

import React, { Component } from 'react';
import {
  StyleSheet,
  View,
  Text,
  PixelRatio,
  Image,
} from 'react-native';
import {
  px2dp,
  fontColorSecDeepGray,
} from '@/styles';
import { Button } from '@/common';
import { iconOutletsStrokeGray, iconPolicyStrokeGray, iconRocketStrokeGray } from '@/images';

export default class Remark extends Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  componentDidMount() {}

  render() {
    return (
      <View style={[styles.wrap]}>
        <View style={styles.header}>
          <Text style={styles.lineLeft} />
          <Text style={styles.title}>特色服务</Text>
          <Text style={styles.lineRight} />
        </View>
        <View style={styles.content}>
          <View style={styles.item}>
            <Image
              source={iconPolicyStrokeGray}
              resizeMode='stretch'
              style={styles.labelImg}
            />
            <Text style={styles.label}>电子保单省心</Text>
          </View>
          <View style={styles.item}>
            <Image
              source={iconRocketStrokeGray}
              resizeMode='stretch'
              style={styles.labelImg}
            />
            <Text style={styles.label}>理赔快捷处理</Text>
          </View>
          <View style={styles.item}>
            <Image
              source={iconOutletsStrokeGray}
              resizeMode='stretch'
              style={styles.labelImg}
            />
            <Text style={styles.label}>网点全面覆盖</Text>
          </View>
        </View>
      </View>
    );
  }
}
const styles = StyleSheet.create({
  wrap: {
    width: px2dp(702),
    alignItems: 'center',
    top: px2dp(-82),
  },
  header: {
    flexDirection: 'row',
    alignItems: 'center',
  },
  lineLeft: {
    width: px2dp(68),
    height: 1 / PixelRatio.get(),
    backgroundColor: '#CDCCC9',
  },
  lineRight: {
    width: px2dp(68),
    height: 1 / PixelRatio.get(),
    backgroundColor: '#CDCCC9',
  },
  title: {
    fontSize: px2dp(28),
    color: fontColorSecDeepGray,
    marginHorizontal: px2dp(24),
  },
  content: {
    flexDirection: 'row',
    justifyContent: 'space-between',
    width: '100%',
    marginTop: px2dp(44)
  },
  item: {
    alignItems: 'center',
  },
  labelImg: {
    width: px2dp(52),
    height: px2dp(52)
  },
  label: {
    fontSize: px2dp(24),
    color: fontColorSecDeepGray,
  },
});
